/*
$.Class("Product.Grid",
// static properties
{     
},
// prototype properties
    {
        // constructor function
        init: function(id) {
        },
        ... function
})
*/

var $p = null;

var app = {
	screen_x : 150,
	screen_y : 150
};
	 
var X,Y = 0;
var o_w = 30;
var step = 3;

$.Class("App",
// static properties
{     
	init : function(){
		$p = p;
		app.setup();
		$p.draw = app.draw;
		
		$p.keyPressed = app.keyPressed;
		app.direction = $p.RIGHT;
	},
	setup : function(){
		X = 0;
	  	Y = 0;
	  	
		$p.size( app.screen_x, app.screen_y);
	  	$p.strokeWeight( 5 );
	  	$p.frameRate( 12 );  	
	  	$p.background( 100 );
	  	$p.stroke(0,200,100);	
	},
	screen_x : 150,
	screen_y : 150	
},{	
	// constructor function
	init: function(canvas_id) {
		process = new Processing(canvas_id, App.init);
	},
	draw : function()
	{
		$p.background( 100 );
		switch(app.direction)
		{
			case $p.UP:
				if(Y != 0)
					Y -= step;
				break;
			case $p.DOWN:
				if(Y != app.screen_y - o_w - step)
					Y += step;			
				break;
			case $p.LEFT:
				if(X != 0)
					X -= step;	
				break;
			case $p.RIGHT:
				if(X != app.screen_x - o_w - step)
					X += step;			
				break;
		}	
		
		$p.rect(X, Y, o_w, o_w);
	}
})
